$(function() {
    // 渲染文章分类
    renderArtCate();

    function renderArtCate() {
        // 发起Ajax请求
        $.ajax({
            method: "get",
            url: "/my/article/cates",
            success: function(res) {
                // console.log(res);
                if (res.status !== 0) {
                    return layui.layer.msg(res.message);
                }

                var htmlstr = template("tpl-table", res);
                $("tbody").html(htmlstr);
            },
        });
    }

    // 添加分类
    // 给按钮添加事件
    // 显示弹出层
    $("#btnAddCate").on("click", function() {
        // 显示弹出层
        var index = layer.open({
            // 1（页面层）
            type: 1,
            // 弹出层标题
            title: "添加文章分类",
            // 设置宽高
            area: ["500px", "300px"],
            // 通过模板引擎获取表单，模板引擎不调用页面不显示
            content: $("#dialog-add").html(),
        });
        $("#form-add").on("submit", function(e) {
            e.preventDefault();
            var data = $(this).serialize();
            $.ajax({
                method: "post",
                url: "/my/article/addcates",
                data: data,
                success: function(res) {
                    if (res.status !== 0) {
                        return layui.layer.msg(res.message);
                    }
                    layui.layer.msg(res.message);
                    layui.layer.close(index);
                    renderArtCate();
                },
            });
        });
    });

    // 删除文章分类
    // 添加点击事件
    // 显示提示框
    // 点击确认删除
    // 事件委托的形式添加点击事件
    $("tbody").on("click", ".btn_delete", function() {
        var that = this; // this指向事件的触发者
        layer.confirm(
            "确定要删除吗?", { icon: 3, title: "提示" },
            function(index) {
                //do something
                var id = $(that).attr("data-id");
                $.ajax({
                    method: "get",
                    url: `/my/article/deletecate/${id}`,
                    success: function(res) {
                        if (res.status !== 0) {
                            return layui.layer.msg(res.message);
                        }
                        layui.layer.msg(res.message);
                        renderArtCate();
                    },
                });
                layer.close(index);
            }
        );
    });

    // 编辑功能
    // 添加点击事件
    // 弹出提示框
    // 数据回显
    $("tbody").on("click", ".btn_edit", function() {
        // 获取id
        var id = $(this).attr("data-id");
        var index = layer.open({
            // 1（页面层）
            type: 1,
            // 弹出层标题
            title: "修改文章分类",
            // 设置宽高
            area: ["500px", "300px"],
            // 通过模板引擎获取表单，模板引擎不调用页面不显示
            content: $("#dialog-edit").html(),
        });
        $.ajax({
            method: "get",
            url: `/my/article/cates/${id}`,
            success: function(res) {
                if (res.status !== 0) {
                    return layui.layer.msg(res.message);
                }
                // 给表单赋值
                layui.form.val("form-edit", res.data);
            },
        });
        // 点击编辑
        $("#form-edit").on("submit", function(e) {
            e.preventDefault();
            var data = $(this).serialize();
            $.ajax({
                method: "post",
                url: "/my/article/updatecate",
                data: data,
                success: function(res) {
                    if (res.status !== 0) {
                        return layui.layer.msg(res.message);
                    }
                    layui.layer.msg(res.message);
                    layui.layer.close(index);
                    renderArtCate();
                },
            });
        });
    });
});